<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="generator" content="VuePress 2.0.0-beta.66">
    <style>
      :root {
        --c-bg: #fff;
      }
      html.dark {
        --c-bg: #22272e;
      }
      html, body {
        background-color: var(--c-bg);
      }
    </style>
    <script>
      const userMode = localStorage.getItem('vuepress-color-scheme');
			const systemDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
			if (userMode === 'dark' || (userMode !== 'light' && systemDarkMode)) {
				document.documentElement.classList.toggle('dark', true);
			}
    </script>
    <title>Markdown | 你好， VuePress ！</title><meta name="description" content="这是我的第一个 VuePress 站点">
    <link rel="preload" href="/assets/style-8a38cc2d.css" as="style"><link rel="stylesheet" href="/assets/style-8a38cc2d.css">
    <link rel="modulepreload" href="/assets/app-6c74e544.js"><link rel="modulepreload" href="/assets/Markdown.html-76abef01.js"><link rel="modulepreload" href="/assets/Markdown.html-24c02676.js"><link rel="prefetch" href="/assets/index.html-75ca5b8c.js" as="script"><link rel="prefetch" href="/assets/化学.html-bcd92d03.js" as="script"><link rel="prefetch" href="/assets/IDEA.html-ce9ad873.js" as="script"><link rel="prefetch" href="/assets/python调用idm下载.html-615c23bf.js" as="script"><link rel="prefetch" href="/assets/index.html-571c49cc.js" as="script"><link rel="prefetch" href="/assets/VuePress2x搭建.html-910a2c4e.js" as="script"><link rel="prefetch" href="/assets/WindowsTerminal.html-4a75819f.js" as="script"><link rel="prefetch" href="/assets/乱七八糟.html-0ad5c8cc.js" as="script"><link rel="prefetch" href="/assets/国内访问GitHub.html-bd9bc6eb.js" as="script"><link rel="prefetch" href="/assets/虚拟机安装凤凰OS.html-fd472c84.js" as="script"><link rel="prefetch" href="/assets/软件工程过程.html-ad186a25.js" as="script"><link rel="prefetch" href="/assets/Java.html-a9e8e4b2.js" as="script"><link rel="prefetch" href="/assets/latex.html-b66b07c2.js" as="script"><link rel="prefetch" href="/assets/Markdown_vuepress.html-7a108572.js" as="script"><link rel="prefetch" href="/assets/Numpy.html-742cd1c8.js" as="script"><link rel="prefetch" href="/assets/python.html-80001bc2.js" as="script"><link rel="prefetch" href="/assets/python爬虫.html-0eaf5c34.js" as="script"><link rel="prefetch" href="/assets/index.html-404afaec.js" as="script"><link rel="prefetch" href="/assets/Redis.html-3c0347e6.js" as="script"><link rel="prefetch" href="/assets/Selenium.html-dd74eb14.js" as="script"><link rel="prefetch" href="/assets/快速幂算法 牛客小白月赛 1-C分元宵.html-6a00d92c.js" as="script"><link rel="prefetch" href="/assets/数据库.html-a9b825b9.js" as="script"><link rel="prefetch" href="/assets/数据结构_学校.html-db54f988.js" as="script"><link rel="prefetch" href="/assets/404.html-f9875e7b.js" as="script"><link rel="prefetch" href="/assets/index.html-f9be7961.js" as="script"><link rel="prefetch" href="/assets/化学.html-55546e87.js" as="script"><link rel="prefetch" href="/assets/IDEA.html-3d6ee1dc.js" as="script"><link rel="prefetch" href="/assets/python调用idm下载.html-862a9ae4.js" as="script"><link rel="prefetch" href="/assets/index.html-71e4b30e.js" as="script"><link rel="prefetch" href="/assets/VuePress2x搭建.html-69ed53cb.js" as="script"><link rel="prefetch" href="/assets/WindowsTerminal.html-d051c0b9.js" as="script"><link rel="prefetch" href="/assets/乱七八糟.html-e6e19f4d.js" as="script"><link rel="prefetch" href="/assets/国内访问GitHub.html-5a1e283c.js" as="script"><link rel="prefetch" href="/assets/虚拟机安装凤凰OS.html-3f19c5ba.js" as="script"><link rel="prefetch" href="/assets/软件工程过程.html-d5033030.js" as="script"><link rel="prefetch" href="/assets/Java.html-07b672b0.js" as="script"><link rel="prefetch" href="/assets/latex.html-139cf75a.js" as="script"><link rel="prefetch" href="/assets/Markdown_vuepress.html-a9f40501.js" as="script"><link rel="prefetch" href="/assets/Numpy.html-6ea20a5f.js" as="script"><link rel="prefetch" href="/assets/python.html-da27b5e1.js" as="script"><link rel="prefetch" href="/assets/python爬虫.html-22e08aed.js" as="script"><link rel="prefetch" href="/assets/index.html-25c668e6.js" as="script"><link rel="prefetch" href="/assets/Redis.html-732c58b4.js" as="script"><link rel="prefetch" href="/assets/Selenium.html-8840df78.js" as="script"><link rel="prefetch" href="/assets/快速幂算法 牛客小白月赛 1-C分元宵.html-41e7e00f.js" as="script"><link rel="prefetch" href="/assets/数据库.html-e55ff260.js" as="script"><link rel="prefetch" href="/assets/数据结构_学校.html-cf35a9b9.js" as="script"><link rel="prefetch" href="/assets/404.html-ad53950d.js" as="script"><link rel="prefetch" href="/assets/mermaid-9e549946.js" as="script">
  </head>
  <body>
    <div id="app"><!--[--><div class="theme-container"><!--[--><header class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/" class=""><img class="logo" src="/img/hero.png" alt="你好， VuePress ！"><span class="site-name can-hide">你好， VuePress ！</span></a></span><div class="navbar-items-wrapper" style=""><!--[--><!--]--><nav class="navbar-items can-hide"><!--[--><div class="navbar-item"><div class="navbar-dropdown-wrapper"><button class="navbar-dropdown-title" type="button" aria-label="编程"><span class="title">编程</span><span class="arrow down"></span></button><button class="navbar-dropdown-title-mobile" type="button" aria-label="编程"><span class="title">编程</span><span class="right arrow"></span></button><ul style="display:none;" class="navbar-dropdown"><!--[--><li class="navbar-dropdown-item"><a href="/program/Java.md" class="" aria-label="Java"><!--[--><!--]--> Java <!--[--><!--]--></a></li><li class="navbar-dropdown-item"><a href="/program/Python.md" class="" aria-label="Python"><!--[--><!--]--> Python <!--[--><!--]--></a></li><li class="navbar-dropdown-item"><!--[--><h4 class="navbar-dropdown-subtitle"><span>笔记</span></h4><ul class="navbar-dropdown-subitem-wrapper"><!--[--><li class="navbar-dropdown-subitem"><a aria-current="page" href="/program/Markdown.html" class="router-link-active router-link-exact-active router-link-active" aria-label="Markdown"><!--[--><!--]--> Markdown <!--[--><!--]--></a></li><li class="navbar-dropdown-subitem"><a href="/program/latex.html" class="" aria-label="Latex"><!--[--><!--]--> Latex <!--[--><!--]--></a></li><!--]--></ul><!--]--></li><li class="navbar-dropdown-item"><a href="/program/数据库.md" class="" aria-label="数据库"><!--[--><!--]--> 数据库 <!--[--><!--]--></a></li><!--]--></ul></div></div><div class="navbar-item"><a href="/hx/化学.md" class="" aria-label="化学"><!--[--><!--]--> 化学 <!--[--><!--]--></a></div><div class="navbar-item"><a href="/others/" class="" aria-label="乱七八糟"><!--[--><!--]--> 乱七八糟 <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://gitee.com/Francis-xsc/francis-xsc" rel="noopener noreferrer" target="_blank" aria-label="Gitee"><!--[--><!--]--> Gitee <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-color-mode-button" title="toggle color mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><!----></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-items"><!--[--><div class="navbar-item"><div class="navbar-dropdown-wrapper"><button class="navbar-dropdown-title" type="button" aria-label="编程"><span class="title">编程</span><span class="arrow down"></span></button><button class="navbar-dropdown-title-mobile" type="button" aria-label="编程"><span class="title">编程</span><span class="right arrow"></span></button><ul style="display:none;" class="navbar-dropdown"><!--[--><li class="navbar-dropdown-item"><a href="/program/Java.md" class="" aria-label="Java"><!--[--><!--]--> Java <!--[--><!--]--></a></li><li class="navbar-dropdown-item"><a href="/program/Python.md" class="" aria-label="Python"><!--[--><!--]--> Python <!--[--><!--]--></a></li><li class="navbar-dropdown-item"><!--[--><h4 class="navbar-dropdown-subtitle"><span>笔记</span></h4><ul class="navbar-dropdown-subitem-wrapper"><!--[--><li class="navbar-dropdown-subitem"><a aria-current="page" href="/program/Markdown.html" class="router-link-active router-link-exact-active router-link-active" aria-label="Markdown"><!--[--><!--]--> Markdown <!--[--><!--]--></a></li><li class="navbar-dropdown-subitem"><a href="/program/latex.html" class="" aria-label="Latex"><!--[--><!--]--> Latex <!--[--><!--]--></a></li><!--]--></ul><!--]--></li><li class="navbar-dropdown-item"><a href="/program/数据库.md" class="" aria-label="数据库"><!--[--><!--]--> 数据库 <!--[--><!--]--></a></li><!--]--></ul></div></div><div class="navbar-item"><a href="/hx/化学.md" class="" aria-label="化学"><!--[--><!--]--> 化学 <!--[--><!--]--></a></div><div class="navbar-item"><a href="/others/" class="" aria-label="乱七八糟"><!--[--><!--]--> 乱七八糟 <!--[--><!--]--></a></div><div class="navbar-item"><a class="external-link" href="https://gitee.com/Francis-xsc/francis-xsc" rel="noopener noreferrer" target="_blank" aria-label="Gitee"><!--[--><!--]--> Gitee <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-items"><!--[--><li><a href="/program/Java.md" class="sidebar-item sidebar-heading collapsible" aria-label="Java"><!--[--><!--]--> Java <!--[--><!--]--></a><!----></li><li><p tabindex="0" class="sidebar-item sidebar-heading collapsible">Python <span class="right arrow"></span></p><ul style="display:none;" class="sidebar-item-children"><!--[--><li><a href="/program/python.html" class="sidebar-item" aria-label="python-北理工"><!--[--><!--]--> python-北理工 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><p tabindex="0" class="sidebar-item sidebar-heading active collapsible">Markdown <span class="down arrow"></span></p><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html" class="router-link-active router-link-exact-active router-link-active sidebar-item active" aria-label="Markdown"><!--[--><!--]--> Markdown <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#基本语法" class="router-link-active router-link-exact-active sidebar-item" aria-label="基本语法"><!--[--><!--]--> 基本语法 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#粗体和斜体" class="router-link-active router-link-exact-active sidebar-item" aria-label="粗体和斜体"><!--[--><!--]--> 粗体和斜体 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#删除线" class="router-link-active router-link-exact-active sidebar-item" aria-label="删除线"><!--[--><!--]--> 删除线 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#转义" class="router-link-active router-link-exact-active sidebar-item" aria-label="转义"><!--[--><!--]--> 转义 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#删除线-1" class="router-link-active router-link-exact-active sidebar-item" aria-label="删除线"><!--[--><!--]--> 删除线 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#标题" class="router-link-active router-link-exact-active sidebar-item" aria-label="标题"><!--[--><!--]--> 标题 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#引用" class="router-link-active router-link-exact-active sidebar-item" aria-label="引用"><!--[--><!--]--> 引用 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#嵌套引用" class="router-link-active router-link-exact-active sidebar-item" aria-label="嵌套引用"><!--[--><!--]--> 嵌套引用 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#代码格式化" class="router-link-active router-link-exact-active sidebar-item" aria-label="代码格式化"><!--[--><!--]--> 代码格式化 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#行内代码" class="router-link-active router-link-exact-active sidebar-item" aria-label="行内代码"><!--[--><!--]--> 行内代码 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#区块代码" class="router-link-active router-link-exact-active sidebar-item" aria-label="区块代码"><!--[--><!--]--> 区块代码 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#列表" class="router-link-active router-link-exact-active sidebar-item" aria-label="列表"><!--[--><!--]--> 列表 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#无序列表" class="router-link-active router-link-exact-active sidebar-item" aria-label="无序列表"><!--[--><!--]--> 无序列表 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#有序列表" class="router-link-active router-link-exact-active sidebar-item" aria-label="有序列表"><!--[--><!--]--> 有序列表 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#多段列表" class="router-link-active router-link-exact-active sidebar-item" aria-label="多段列表"><!--[--><!--]--> 多段列表 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#链接" class="router-link-active router-link-exact-active sidebar-item" aria-label="链接"><!--[--><!--]--> 链接 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#行内式链接" class="router-link-active router-link-exact-active sidebar-item" aria-label="行内式链接"><!--[--><!--]--> 行内式链接 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#参考式链接" class="router-link-active router-link-exact-active sidebar-item" aria-label="参考式链接"><!--[--><!--]--> 参考式链接 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#页内导航" class="router-link-active router-link-exact-active sidebar-item" aria-label="页内导航"><!--[--><!--]--> 页内导航 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#图片" class="router-link-active router-link-exact-active sidebar-item" aria-label="图片"><!--[--><!--]--> 图片 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#排版" class="router-link-active router-link-exact-active sidebar-item" aria-label="排版"><!--[--><!--]--> 排版 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#单张图片" class="router-link-active router-link-exact-active sidebar-item" aria-label="单张图片"><!--[--><!--]--> 单张图片 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#两张图片并排显示" class="router-link-active router-link-exact-active sidebar-item" aria-label="两张图片并排显示"><!--[--><!--]--> 两张图片并排显示 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#分割线" class="router-link-active router-link-exact-active sidebar-item" aria-label="分割线"><!--[--><!--]--> 分割线 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#转义-1" class="router-link-active router-link-exact-active sidebar-item" aria-label="转义"><!--[--><!--]--> 转义 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#表格" class="router-link-active router-link-exact-active sidebar-item" aria-label="表格"><!--[--><!--]--> 表格 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#对齐" class="router-link-active router-link-exact-active sidebar-item" aria-label="对齐"><!--[--><!--]--> 对齐 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#脚注" class="router-link-active router-link-exact-active sidebar-item" aria-label="脚注"><!--[--><!--]--> 脚注 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#行内公式" class="router-link-active router-link-exact-active sidebar-item" aria-label="行内公式"><!--[--><!--]--> 行内公式 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#陈列公式" class="router-link-active router-link-exact-active sidebar-item" aria-label="陈列公式"><!--[--><!--]--> 陈列公式 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#mathjax语法" class="router-link-active router-link-exact-active sidebar-item" aria-label="MathJax语法"><!--[--><!--]--> MathJax语法 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#uml图" class="router-link-active router-link-exact-active sidebar-item" aria-label="UML图"><!--[--><!--]--> UML图 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#序列图" class="router-link-active router-link-exact-active sidebar-item" aria-label="序列图"><!--[--><!--]--> 序列图 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#uml标准时序图" class="router-link-active router-link-exact-active sidebar-item" aria-label="UML标准时序图"><!--[--><!--]--> UML标准时序图 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#序列图语法" class="router-link-active router-link-exact-active sidebar-item" aria-label="序列图语法"><!--[--><!--]--> 序列图语法 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#饼图" class="router-link-active router-link-exact-active sidebar-item" aria-label="饼图"><!--[--><!--]--> 饼图 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#流程图" class="router-link-active router-link-exact-active sidebar-item" aria-label="流程图"><!--[--><!--]--> 流程图 <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#横向流程图" class="router-link-active router-link-exact-active sidebar-item" aria-label="横向流程图"><!--[--><!--]--> 横向流程图 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#竖向流程图" class="router-link-active router-link-exact-active sidebar-item" aria-label="竖向流程图"><!--[--><!--]--> 竖向流程图 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#标准流程图" class="router-link-active router-link-exact-active sidebar-item" aria-label="标准流程图"><!--[--><!--]--> 标准流程图 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#标准流程图-横向" class="router-link-active router-link-exact-active sidebar-item" aria-label="标准流程图（横向）"><!--[--><!--]--> 标准流程图（横向） <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#流程图语法" class="router-link-active router-link-exact-active sidebar-item" aria-label="流程图语法"><!--[--><!--]--> 流程图语法 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#甘特图" class="router-link-active router-link-exact-active sidebar-item" aria-label="甘特图"><!--[--><!--]--> 甘特图 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#在vuepress中使用mermaid" class="router-link-active router-link-exact-active sidebar-item" aria-label="在vuepress中使用mermaid"><!--[--><!--]--> 在vuepress中使用mermaid <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#数学公式" class="router-link-active router-link-exact-active sidebar-item" aria-label="数学公式"><!--[--><!--]--> 数学公式 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#待办事项" class="router-link-active router-link-exact-active sidebar-item" aria-label="待办事项"><!--[--><!--]--> 待办事项 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#html" class="router-link-active router-link-exact-active sidebar-item" aria-label="HTML"><!--[--><!--]--> HTML <!--[--><!--]--></a><ul style="" class="sidebar-item-children"><!--[--><li><a aria-current="page" href="/program/Markdown.html#任务列表" class="router-link-active router-link-exact-active sidebar-item" aria-label="任务列表"><!--[--><!--]--> 任务列表 <!--[--><!--]--></a><!----></li><!--]--></ul></li><li><a aria-current="page" href="/program/Markdown.html#跨度元素-html" class="router-link-active router-link-exact-active sidebar-item" aria-label="跨度元素-HTML"><!--[--><!--]--> 跨度元素-HTML <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#跨度元素-嵌入内容" class="router-link-active router-link-exact-active sidebar-item" aria-label="跨度元素-嵌入内容"><!--[--><!--]--> 跨度元素-嵌入内容 <!--[--><!--]--></a><!----></li><li><a aria-current="page" href="/program/Markdown.html#跨度元素-换行符" class="router-link-active router-link-exact-active sidebar-item" aria-label="跨度元素-换行符"><!--[--><!--]--> 跨度元素-换行符 <!--[--><!--]--></a><!----></li><!--]--></ul></li><!--]--></ul></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><!--]--><div><h1 id="markdown" tabindex="-1"><a class="header-anchor" href="#markdown" aria-hidden="true">#</a> Markdown</h1><h2 id="基本语法" tabindex="-1"><a class="header-anchor" href="#基本语法" aria-hidden="true">#</a> 基本语法</h2><h3 id="粗体和斜体" tabindex="-1"><a class="header-anchor" href="#粗体和斜体" aria-hidden="true">#</a> 粗体和斜体</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>*斜体文本*
_斜体文本_
**粗体文本**
__粗体文本__
***粗斜体文本***
___粗斜体文本___
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-markdown line-numbers-mode" data-ext="md"><pre class="language-markdown"><code><span class="token italic"><span class="token punctuation">*</span><span class="token content">斜体文本</span><span class="token punctuation">*</span></span>
<span class="token italic"><span class="token punctuation">_</span><span class="token content">斜体文本</span><span class="token punctuation">_</span></span>
<span class="token bold"><span class="token punctuation">**</span><span class="token content">粗体文本</span><span class="token punctuation">**</span></span>
<span class="token bold"><span class="token punctuation">__</span><span class="token content">粗体文本</span><span class="token punctuation">__</span></span>
<span class="token bold"><span class="token punctuation">**</span><span class="token content"><span class="token italic"><span class="token punctuation">*</span><span class="token content">粗斜体文本</span><span class="token punctuation">*</span></span></span><span class="token punctuation">**</span></span>
<span class="token bold"><span class="token punctuation">__</span><span class="token content"><span class="token italic"><span class="token punctuation">_</span><span class="token content">粗斜体文本</span><span class="token punctuation">_</span></span></span><span class="token punctuation">__</span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="删除线" tabindex="-1"><a class="header-anchor" href="#删除线" aria-hidden="true">#</a> 删除线</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>~~BAIDU.COM~~
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><p><s>BAIDU.COM</s></p><h2 id="转义" tabindex="-1"><a class="header-anchor" href="#转义" aria-hidden="true">#</a> 转义</h2><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>\*\* 正常显示星号 \*\*
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><p>** 正常显示星号 **</p><h3 id="删除线-1" tabindex="-1"><a class="header-anchor" href="#删除线-1" aria-hidden="true">#</a> 删除线</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>~~删除线的文字~~
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><div class="language-markdown line-numbers-mode" data-ext="md"><pre class="language-markdown"><code><span class="token strike"><span class="token punctuation">~~</span><span class="token content">删除线的文字</span><span class="token punctuation">~~</span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><h3 id="标题" tabindex="-1"><a class="header-anchor" href="#标题" aria-hidden="true">#</a> 标题</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code># 一号标题
## 二号标题
### 三号标题
#### 四号标题
##### 五号标题
###### 六号标题
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="引用" tabindex="-1"><a class="header-anchor" href="#引用" aria-hidden="true">#</a> 引用</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>&gt; 引用
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><blockquote><p>引用</p></blockquote><p>分割线</p><div class="language-text line-numbers-mode" data-ext="text"><pre class="language-text"><code>---
***
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div></div></div><hr><h3 id="嵌套引用" tabindex="-1"><a class="header-anchor" href="#嵌套引用" aria-hidden="true">#</a> 嵌套引用</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>&gt; 这里是个引用
&gt; &gt; 嵌套引用
&gt; 
&gt; 这里是个引用
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><blockquote><p>这里是个引用</p><blockquote><p>嵌套引用</p></blockquote><p>这里是个引用</p></blockquote><h2 id="代码格式化" tabindex="-1"><a class="header-anchor" href="#代码格式化" aria-hidden="true">#</a> 代码格式化</h2><h3 id="行内代码" tabindex="-1"><a class="header-anchor" href="#行内代码" aria-hidden="true">#</a> 行内代码</h3><p>使用反引号“`”</p><h3 id="区块代码" tabindex="-1"><a class="header-anchor" href="#区块代码" aria-hidden="true">#</a> 区块代码</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```c++
#include&lt;iostream&gt;
using namespace std;
int main()
{
	cout&lt;&lt;&quot;HelloWorld!&quot;;
}
​```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-c++ line-numbers-mode" data-ext="c++"><pre class="language-c++"><code>#include&lt;iostream&gt;
using namespace std;
int main()
{
	cout&lt;&lt;&quot;HelloWorld!&quot;;
}
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="列表" tabindex="-1"><a class="header-anchor" href="#列表" aria-hidden="true">#</a> 列表</h2><h3 id="无序列表" tabindex="-1"><a class="header-anchor" href="#无序列表" aria-hidden="true">#</a> 无序列表</h3><p>星号*、加号+或减号-</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>* Red
* Green
* Blue
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><ul><li>Red</li><li>Green</li><li>Blue</li></ul><h3 id="有序列表" tabindex="-1"><a class="header-anchor" href="#有序列表" aria-hidden="true">#</a> 有序列表</h3><p>数字+英文句点</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>1. Green
2. Blue
3. Red
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><ol><li>Green</li><li>Blue</li><li>Red</li></ol><p>注：列表可嵌套</p><h3 id="多段列表" tabindex="-1"><a class="header-anchor" href="#多段列表" aria-hidden="true">#</a> 多段列表</h3><p>列表项里可以包含多个段落，每个项目下的段落都必须缩进 4 个空格或是 1 个制表符。</p><h2 id="链接" tabindex="-1"><a class="header-anchor" href="#链接" aria-hidden="true">#</a> 链接</h2><h3 id="行内式链接" tabindex="-1"><a class="header-anchor" href="#行内式链接" aria-hidden="true">#</a> 行内式链接</h3><p>方块括号后面紧接着圆括号并插入网址链接即可，如果你还想要加上链接的 title 文字，只要在网址后面，用双引号把 title 文字包起来即可。</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>[百度](https://www.baidu.com/ &quot;百度一下，你就知道&quot;)
[百度](https://www.baidu.com/)
直接使用链接地址：
&lt;https://www.runoob.com&gt;
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p><a href="https://www.baidu.com/" title="百度一下，你就知道" target="_blank" rel="noopener noreferrer">带标题的百度<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><p><a href="https://www.baidu.com/" target="_blank" rel="noopener noreferrer">百度<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><p><a href="https://www.runoob.com" target="_blank" rel="noopener noreferrer">https://www.runoob.com<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><h2 id="参考式链接" tabindex="-1"><a class="header-anchor" href="#参考式链接" aria-hidden="true">#</a> 参考式链接</h2><p>链接内容定义格式为：</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>[链接名]: 链接地址 &quot;链接title&quot;
[链接名]: 空格(或tab) 链接地址 空格 &quot;链接地址&quot;(可省略)12
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div></div></div><p>设置链接的格式为:</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>[链接文字][链接名称]
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>这个链接用 1 作为网址变量 [Google][1]
这个链接用 runoob 作为网址变量 [Runoob][runoob]
然后在文档的结尾为变量赋值（网址）

  [1]: http://www.google.com/
  [runoob]: http://www.runoob.com/
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>这个链接用 1 作为网址变量 <a href="http://www.google.com/" target="_blank" rel="noopener noreferrer">Google<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> 这个链接用 runoob 作为网址变量 <a href="http://www.runoob.com/" target="_blank" rel="noopener noreferrer">Runoob<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a> 然后在文档的结尾为变量赋值（网址）</p><h3 id="页内导航" tabindex="-1"><a class="header-anchor" href="#页内导航" aria-hidden="true">#</a> 页内导航</h3><ol><li>先定义一个锚记 <code>&lt;div id=&quot;footer&quot;&gt;&lt;/div&gt;</code></li><li>然后设置页内链接 <code>[到底部](#footer)</code> 我们可以类似的方式去实现文章的页内导航。单击下面的链接跳转到2.4链接。</li></ol><h2 id="图片" tabindex="-1"><a class="header-anchor" href="#图片" aria-hidden="true">#</a> 图片</h2><p>行内式</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>![Alt text](/path/to/img.jpg)
![Alt text](/path/to/img.jpg &quot;Optional title&quot;)
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div></div></div><p>参考式</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>![Alt text][id]
[id]: url/to/image  &quot;Optional title attribute&quot;
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="排版" tabindex="-1"><a class="header-anchor" href="#排版" aria-hidden="true">#</a> 排版</h2><h3 id="单张图片" tabindex="-1"><a class="header-anchor" href="#单张图片" aria-hidden="true">#</a> 单张图片</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>&lt;div align=&quot;center&quot;&gt;
&lt;img src=&quot;图片地址&quot; height=&quot;100px&quot; alt=&quot;图片说明&quot; &gt;
&lt;/div&gt;
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div align="center"><img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" height="100px" alt="图片说明"></div><h3 id="两张图片并排显示" tabindex="-1"><a class="header-anchor" href="#两张图片并排显示" aria-hidden="true">#</a> 两张图片并排显示</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>&lt;div align=&quot;center&quot;&gt;
&lt;img src=&quot;https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png&quot; height=&quot;100px&quot; alt=&quot;图片说明&quot; &gt;
&lt;img src=&quot;https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png&quot; height=&quot;100px&quot; alt=&quot;图片说明&quot; &gt;
&lt;/div&gt;
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div align="center"><img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" height="100px" alt="图片说明"><img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" height="100px" alt="图片说明"></div><h2 id="分割线" tabindex="-1"><a class="header-anchor" href="#分割线" aria-hidden="true">#</a> 分割线</h2><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>* * *
***
- - -
---
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><hr><h2 id="转义-1" tabindex="-1"><a class="header-anchor" href="#转义-1" aria-hidden="true">#</a> 转义</h2><p>在这些字符前面加入反斜杠来表示转义</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>\   反斜线
`   反引号
*   星号
_   底线
{}  花括号
[]  方括号
()  括弧
#   井字号
+   加号
-   减号
.   英文句点
!   感叹号
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="表格" tabindex="-1"><a class="header-anchor" href="#表格" aria-hidden="true">#</a> 表格</h2><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>教程标题| 主要内容
-------|----------
关于Markdown | 简介Markdown，Markdown的优缺点
Markdown基础 | Markdown的**基本语法**，格式化文本、代码、列表、链接和图片、分割线、转义符等
Markdown表格和公式 | Markdown的**扩展语法**，表格、公式
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><table><thead><tr><th>教程标题</th><th>主要内容</th></tr></thead><tbody><tr><td>关于Markdown</td><td>简介Markdown，Markdown的优缺点</td></tr><tr><td>Markdown基础</td><td>Markdown的<strong>基本语法</strong>，格式化文本、代码、列表、链接和图片、分割线、转义符等</td></tr><tr><td>Markdown表格和公式</td><td>Markdown的<strong>扩展语法</strong>，表格、公式</td></tr></tbody></table><h3 id="对齐" tabindex="-1"><a class="header-anchor" href="#对齐" aria-hidden="true">#</a> 对齐</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>| Day     | Meal     | Price   |
|:--------|---------:|:-------:|
| Monday  | pasta    | $6      |
| Tuesday | chicken  | $8      |
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><table><thead><tr><th style="text-align:left;">Day</th><th style="text-align:right;">Meal</th><th style="text-align:center;">Price</th></tr></thead><tbody><tr><td style="text-align:left;">Monday</td><td style="text-align:right;">pasta</td><td style="text-align:center;">$6</td></tr><tr><td style="text-align:left;">Tuesday</td><td style="text-align:right;">chicken</td><td style="text-align:center;">$8</td></tr></tbody></table><h2 id="脚注" tabindex="-1"><a class="header-anchor" href="#脚注" aria-hidden="true">#</a> 脚注</h2><p><code>[^要注明的文本]</code></p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>创建脚注格式类似这样 [^RUNOOB]。

[^RUNOOB]: 菜鸟教程 -- 学的不仅是技术，更是梦想！！！
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>创建脚注格式类似这样 [^RUNOOB]。</p><p>[^RUNOOB]: 菜鸟教程 -- 学的不仅是技术，更是梦想！！！</p><h2 id="行内公式" tabindex="-1"><a class="header-anchor" href="#行内公式" aria-hidden="true">#</a> 行内公式</h2><p>引入MathJax插件</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>&lt;script type=&quot;text/javascript&quot; src=&quot;https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML&quot;&gt;&lt;/script&gt;
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><p>我们使用<code>$...$</code>的方式来包含行内公式</p><p>例：</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>一个简单的数学公式,求圆的面积$S=\pi r^2$。
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><p>一个简单的数学公式,求圆的面积<!---->。</p><h2 id="陈列公式" tabindex="-1"><a class="header-anchor" href="#陈列公式" aria-hidden="true">#</a> 陈列公式</h2><p>陈列公式使用<code>$$...$$</code>来表示</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>如果使用陈列公式，结果为：
一个简单的数学公式，求圆的面积。
$$
	S=\pi r^2
$$
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>如果使用陈列公式，结果为： 一个简单的数学公式，求圆的面积。 $$ S=\pi r^2 $$</p><h2 id="mathjax语法" tabindex="-1"><a class="header-anchor" href="#mathjax语法" aria-hidden="true">#</a> MathJax语法</h2><h2 id="uml图" tabindex="-1"><a class="header-anchor" href="#uml图" aria-hidden="true">#</a> UML图</h2><h3 id="序列图" tabindex="-1"><a class="header-anchor" href="#序列图" aria-hidden="true">#</a> 序列图</h3><p><strong>注意：所有的序列图代码需要放在一个语法类型为sequence</strong>的代码块中。</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```mermaid
sequenceDiagram
DHCP客户机--&gt;&gt;DHCP服务器: IP租约请求
DHCP服务器--&gt;&gt;DHCP客户机: IP租约提供
DHCP客户机--&gt;&gt;DHCP服务器: IP租约选择
DHCP服务器--&gt;&gt;DHCP客户机: IP租约确认

​```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-mermaid line-numbers-mode" data-ext="mermaid"><pre class="language-mermaid"><code><span class="token keyword">sequenceDiagram</span>
DHCP客户机<span class="token arrow operator">--&gt;&gt;</span>DHCP服务器<span class="token operator">:</span> IP租约请求
DHCP服务器<span class="token arrow operator">--&gt;&gt;</span>DHCP客户机<span class="token operator">:</span> IP租约提供
DHCP客户机<span class="token arrow operator">--&gt;&gt;</span>DHCP服务器<span class="token operator">:</span> IP租约选择
DHCP服务器<span class="token arrow operator">--&gt;&gt;</span>DHCP客户机<span class="token operator">:</span> IP租约确认
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```sequence
对象A-&gt;对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B--&gt;对象A: 我很好(响应)
对象A-&gt;对象B: 你真的好吗？
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-sequence line-numbers-mode" data-ext="sequence"><pre class="language-sequence"><code>对象A-&gt;对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B--&gt;对象A: 我很好(响应)
对象A-&gt;对象B: 你真的好吗？
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```sequence
Title: 标题：复杂使用
对象A-&gt;对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B--&gt;对象A: 我很好(响应)
对象B-&gt;小三: 你好吗
小三--&gt;&gt;对象A: 对象B找我了
对象A-&gt;对象B: 你真的好吗？
Note over 小三,对象B: 我们是朋友
participant C
Note right of C: 没人陪我玩
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-sequence line-numbers-mode" data-ext="sequence"><pre class="language-sequence"><code>Title: 标题：复杂使用
对象A-&gt;对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B--&gt;对象A: 我很好(响应)
对象B-&gt;小三: 你好吗
小三--&gt;&gt;对象A: 对象B找我了
对象A-&gt;对象B: 你真的好吗？
Note over 小三,对象B: 我们是朋友
participant C
Note right of C: 没人陪我玩
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="uml标准时序图" tabindex="-1"><a class="header-anchor" href="#uml标准时序图" aria-hidden="true">#</a> UML标准时序图</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```mermaid
%% 时序图例子,-&gt; 直线，--&gt;虚线，-&gt;&gt;实线箭头
  sequenceDiagram
    participant 张三
    participant 李四
    张三-&gt;王五: 王五你好吗？
    loop 健康检查
        王五-&gt;王五: 与疾病战斗
    end
    Note right of 王五: 合理 食物 &lt;br/&gt;看医生...
    李四--&gt;&gt;张三: 很好!
    王五-&gt;李四: 你怎么样?
    李四--&gt;王五: 很好!
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-mermaid line-numbers-mode" data-ext="mermaid"><pre class="language-mermaid"><code><span class="token comment">%% 时序图例子,-&gt; 直线，--&gt;虚线，-&gt;&gt;实线箭头</span>
  <span class="token keyword">sequenceDiagram</span>
    <span class="token keyword">participant</span> 张三
    <span class="token keyword">participant</span> 李四
    张三<span class="token arrow operator">-&gt;</span>王五<span class="token operator">:</span> 王五你好吗？
    <span class="token keyword">loop</span> 健康检查
        王五<span class="token arrow operator">-&gt;</span>王五<span class="token operator">:</span> 与疾病战斗
    <span class="token keyword">end</span>
    <span class="token keyword">Note right of</span> 王五<span class="token operator">:</span> 合理 食物 &lt;br/&gt;看医生...
    李四<span class="token arrow operator">--&gt;&gt;</span>张三<span class="token operator">:</span> 很好!
    王五<span class="token arrow operator">-&gt;</span>李四<span class="token operator">:</span> 你怎么样?
    李四<span class="token arrow operator">--&gt;</span>王五<span class="token operator">:</span> 很好!
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="序列图语法" tabindex="-1"><a class="header-anchor" href="#序列图语法" aria-hidden="true">#</a> 序列图语法</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>title: 序列图标题
participant A
participant B
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-sequence line-numbers-mode" data-ext="sequence"><pre class="language-sequence"><code>title:title
participant A
participant B
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><ul><li>设置note， <ul><li>左侧note： note left of acotor： message</li><li>右侧note： note right of actor: message,</li><li>覆盖note： note over actor:message</li></ul></li></ul><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>note left of A: 左侧note
note right of B: 右侧note
note over C: 覆盖note
note over A,B: 覆盖多个actor
note over B,C: 测试下\n 换行
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-sequence line-numbers-mode" data-ext="sequence"><pre class="language-sequence"><code>note left of A: 左侧note
note right of B: 右侧note
note over C: 覆盖note
note over A,B: 覆盖多个actor
note over B,C: 测试下\n 换行
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><ul><li>设置会话， <ul><li>实线实箭头： actor-&gt;actor: message</li><li>虚线实箭头： actor–&gt;actor:message</li><li>实线虚箭头： actor-&gt;&gt;actor:message</li><li>虚线虚箭头： actor–&gt;&gt;actor:message</li></ul></li></ul><div class="language-TXT line-numbers-mode" data-ext="TXT"><pre class="language-TXT"><code> A-&gt;A:自言自语
 A-&gt;B:实线实箭头
 A--&gt;B:虚线实箭头
 A-&gt;&gt;B:实线虚箭头
 A--&gt;&gt;B:虚线虚箭头
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-sequence line-numbers-mode" data-ext="sequence"><pre class="language-sequence"><code> A-&gt;A:自言自语
 A-&gt;B:实线实箭头
 A--&gt;B:虚线实箭头
 A-&gt;&gt;B:实线虚箭头
 A--&gt;&gt;B:虚线虚箭头
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="饼图" tabindex="-1"><a class="header-anchor" href="#饼图" aria-hidden="true">#</a> 饼图</h2><p>语法</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>pie	showdata
	title [titleValue]
	[dataKey1] : [dataValue1]
	[dataKey2] : [dataValue2]
	……
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```mermaid
	pie showData
    title Key elements in Product X
    &quot;Calcium&quot; : 40.50
    &quot;Potassium&quot; : 45.5
    &quot;Magnesium&quot; : 10
    &quot;Iron&quot; :  5
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-mermaid line-numbers-mode" data-ext="mermaid"><pre class="language-mermaid"><code>	<span class="token keyword">pie</span> showData
    title Key elements in Product X
    <span class="token string">&quot;Calcium&quot;</span> <span class="token operator">:</span> 40.50
    <span class="token string">&quot;Potassium&quot;</span> <span class="token operator">:</span> 45.5
    <span class="token string">&quot;Magnesium&quot;</span> <span class="token operator">:</span> 10
    <span class="token string">&quot;Iron&quot;</span> <span class="token operator">:</span>  5
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p><a href="https://blog.csdn.net/zhw21w/article/details/125749449" target="_blank" rel="noopener noreferrer">时序图和饼图的参考链接<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><p><a href="https://blog.csdn.net/BurneAris/article/details/106671124" target="_blank" rel="noopener noreferrer">Mermaid语法<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><h2 id="流程图" tabindex="-1"><a class="header-anchor" href="#流程图" aria-hidden="true">#</a> 流程图</h2><p>主要的语法为 <code>name=&gt;type: describe</code>，其中 type 主要有以下几种： 1.开始和结束：<code>start</code> <code>end</code> 2.输入输出：<code>inputoutput</code> 3.操作：<code>operation</code> 4.条件：<code>condition</code> 5.子程序：<code>subroutine</code></p><p><strong>注意：所有的流程图代码需要放在一个语法类型为flow</strong>的代码块中。</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>st=&gt;start: Start
e=&gt;end
op=&gt;operation: My Operation
cond=&gt;condition: Yes or No?

st-&gt;op-&gt;cond
cond(yes)-&gt;e
cond(no)-&gt;op
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>st<span class="token operator">=&gt;</span>start<span class="token operator">:</span> Start
e<span class="token operator">=&gt;</span>end
op<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> My Operation
cond<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> Yes or No<span class="token operator">?</span>

st<span class="token operator">-</span><span class="token operator">&gt;</span>op<span class="token operator">-</span><span class="token operator">&gt;</span>cond
<span class="token function">cond</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>e
<span class="token function">cond</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>st=&gt;start: Start:&gt;http://www.google.com[blank]
e=&gt;end:&gt;http://www.google.com
op1=&gt;operation: My Operation
sub1=&gt;subroutine: My Subroutine
cond=&gt;condition: Yes
or No?:&gt;http://www.google.com
io=&gt;inputoutput: catch something...
para=&gt;parallel: parallel tasks

st-&gt;op1-&gt;cond
cond(yes)-&gt;io-&gt;e
cond(no)-&gt;para
para(path1, bottom)-&gt;sub1(right)-&gt;op1
para(path2, top)-&gt;op1
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>st<span class="token operator">=&gt;</span>start<span class="token operator">:</span> Start<span class="token operator">:</span><span class="token operator">&gt;</span>http<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>google<span class="token punctuation">.</span>com<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
e<span class="token operator">=&gt;</span>end<span class="token operator">:</span><span class="token operator">&gt;</span>http<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>google<span class="token punctuation">.</span>com
op1<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> My Operation
sub1<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> My Subroutine
cond<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> Yes
or No<span class="token operator">?</span><span class="token operator">:</span><span class="token operator">&gt;</span>http<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>google<span class="token punctuation">.</span>com
io<span class="token operator">=&gt;</span>inputoutput<span class="token operator">:</span> catch something<span class="token operator">...</span>
para<span class="token operator">=&gt;</span>parallel<span class="token operator">:</span> parallel tasks

st<span class="token operator">-</span><span class="token operator">&gt;</span>op1<span class="token operator">-</span><span class="token operator">&gt;</span>cond
<span class="token function">cond</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>io<span class="token operator">-</span><span class="token operator">&gt;</span>e
<span class="token function">cond</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>para
<span class="token function">para</span><span class="token punctuation">(</span>path1<span class="token punctuation">,</span> bottom<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">sub1</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op1
<span class="token function">para</span><span class="token punctuation">(</span>path2<span class="token punctuation">,</span> top<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op1
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>st=&gt;start: Start|past:&gt;http://www.google.com[blank]
e=&gt;end: End|future:&gt;http://www.google.com
op1=&gt;operation: My Operation|past
op2=&gt;operation: Stuff|current
sub1=&gt;subroutine: My Subroutine|invalid
cond=&gt;condition: Yes
or No?|approved:&gt;http://www.google.com
c2=&gt;condition: Good idea|rejected
io=&gt;inputoutput: catch something...|future

st-&gt;op1(right)-&gt;cond
cond(yes, right)-&gt;c2
cond(no)-&gt;sub1(left)-&gt;op1
c2(yes)-&gt;io-&gt;e
c2(no)-&gt;op2-&gt;e
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>st<span class="token operator">=&gt;</span>start<span class="token operator">:</span> Start<span class="token operator">|</span>past<span class="token operator">:</span><span class="token operator">&gt;</span>http<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>google<span class="token punctuation">.</span>com<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
e<span class="token operator">=&gt;</span>end<span class="token operator">:</span> End<span class="token operator">|</span>future<span class="token operator">:</span><span class="token operator">&gt;</span>http<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>google<span class="token punctuation">.</span>com
op1<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> My Operation<span class="token operator">|</span>past
op2<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> Stuff<span class="token operator">|</span>current
sub1<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> My Subroutine<span class="token operator">|</span>invalid
cond<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> Yes
or No<span class="token operator">?</span><span class="token operator">|</span>approved<span class="token operator">:</span><span class="token operator">&gt;</span>http<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>google<span class="token punctuation">.</span>com
c2<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> Good idea<span class="token operator">|</span>rejected
io<span class="token operator">=&gt;</span>inputoutput<span class="token operator">:</span> catch something<span class="token operator">...</span><span class="token operator">|</span>future

st<span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">op1</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>cond
<span class="token function">cond</span><span class="token punctuation">(</span>yes<span class="token punctuation">,</span> right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>c2
<span class="token function">cond</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">sub1</span><span class="token punctuation">(</span>left<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op1
<span class="token function">c2</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>io<span class="token operator">-</span><span class="token operator">&gt;</span>e
<span class="token function">c2</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op2<span class="token operator">-</span><span class="token operator">&gt;</span>e
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-text line-numbers-mode" data-ext="text"><pre class="language-text"><code>st=&gt;start: Improve your
l10n process!
e=&gt;end: Continue to have fun!:&gt;https://youtu.be/YQryHo1iHb8[blank]
op1=&gt;operation: Go to locize.com:&gt;https://locize.com[blank]
sub1=&gt;subroutine: Read the awesomeness
cond(align-next=no)=&gt;condition: Interested to
getting started?
io=&gt;inputoutput: Register:&gt;https://www.locize.app/register[blank]
sub2=&gt;subroutine: Read about improving
your localization workflow
or another source:&gt;https://medium.com/@adrai/8-signs-you-should-improve-your-localization-process-3dc075d53998[blank]
op2=&gt;operation: Login:&gt;https://www.locize.app/login[blank]
cond2=&gt;condition: valid password?
cond3=&gt;condition: reset password?
op3=&gt;operation: send email
sub3=&gt;subroutine: Create a demo project
sub4=&gt;subroutine: Start your real project
io2=&gt;inputoutput: Subscribe

st-&gt;op1-&gt;sub1-&gt;cond
cond(yes)-&gt;io-&gt;op2-&gt;cond2
cond2(no)-&gt;cond3
cond3(no,bottom)-&gt;op2
cond3(yes)-&gt;op3
op3(right)-&gt;op2
cond2(yes)-&gt;sub3
sub3-&gt;sub4-&gt;io2-&gt;e
cond(no)-&gt;sub2(right)-&gt;op1

st@&gt;op1({&quot;stroke&quot;:&quot;Red&quot;})@&gt;sub1({&quot;stroke&quot;:&quot;Red&quot;})@&gt;cond({&quot;stroke&quot;:&quot;Red&quot;})@&gt;io({&quot;stroke&quot;:&quot;Red&quot;})@&gt;op2({&quot;stroke&quot;:&quot;Red&quot;})@&gt;cond2({&quot;stroke&quot;:&quot;Red&quot;})@&gt;sub3({&quot;stroke&quot;:&quot;Red&quot;})@&gt;sub4({&quot;stroke&quot;:&quot;Red&quot;})@&gt;io2({&quot;stroke&quot;:&quot;Red&quot;})@&gt;e({&quot;stroke&quot;:&quot;Red&quot;,&quot;stroke-width&quot;:6,&quot;arrow-end&quot;:&quot;classic-wide-long&quot;})
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>st<span class="token operator">=&gt;</span>start<span class="token operator">:</span> Improve your
l10n process<span class="token operator">!</span>
e<span class="token operator">=&gt;</span>end<span class="token operator">:</span> Continue to have fun<span class="token operator">!</span><span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>youtu<span class="token punctuation">.</span>be<span class="token operator">/</span>YQryHo1iHb8<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
op1<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> Go to locize<span class="token punctuation">.</span>com<span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>locize<span class="token punctuation">.</span>com<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
sub1<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> Read the awesomeness
<span class="token function">cond</span><span class="token punctuation">(</span>align<span class="token operator">-</span>next<span class="token operator">=</span>no<span class="token punctuation">)</span><span class="token operator">=&gt;</span>condition<span class="token operator">:</span> Interested to
getting started<span class="token operator">?</span>
io<span class="token operator">=&gt;</span>inputoutput<span class="token operator">:</span> Register<span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>locize<span class="token punctuation">.</span>app<span class="token operator">/</span>register<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
sub2<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> Read about improving
your localization workflow
or another source<span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>medium<span class="token punctuation">.</span>com<span class="token operator">/</span>@adrai<span class="token operator">/</span><span class="token number">8</span><span class="token operator">-</span>signs<span class="token operator">-</span>you<span class="token operator">-</span>should<span class="token operator">-</span>improve<span class="token operator">-</span>your<span class="token operator">-</span>localization<span class="token operator">-</span>process<span class="token operator">-</span>3dc075d53998<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
op2<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> Login<span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>locize<span class="token punctuation">.</span>app<span class="token operator">/</span>login<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
cond2<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> valid password<span class="token operator">?</span>
cond3<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> reset password<span class="token operator">?</span>
op3<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> send email
sub3<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> Create a demo project
sub4<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> Start your real project
io2<span class="token operator">=&gt;</span>inputoutput<span class="token operator">:</span> Subscribe

st<span class="token operator">-</span><span class="token operator">&gt;</span>op1<span class="token operator">-</span><span class="token operator">&gt;</span>sub1<span class="token operator">-</span><span class="token operator">&gt;</span>cond
<span class="token function">cond</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>io<span class="token operator">-</span><span class="token operator">&gt;</span>op2<span class="token operator">-</span><span class="token operator">&gt;</span>cond2
<span class="token function">cond2</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>cond3
<span class="token function">cond3</span><span class="token punctuation">(</span>no<span class="token punctuation">,</span>bottom<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op2
<span class="token function">cond3</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op3
<span class="token function">op3</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op2
<span class="token function">cond2</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>sub3
sub3<span class="token operator">-</span><span class="token operator">&gt;</span>sub4<span class="token operator">-</span><span class="token operator">&gt;</span>io2<span class="token operator">-</span><span class="token operator">&gt;</span>e
<span class="token function">cond</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">sub2</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op1

st@<span class="token operator">&gt;</span><span class="token function">op1</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">sub1</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">cond</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">io</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">op2</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">cond2</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">sub3</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">sub4</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">io2</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>@<span class="token operator">&gt;</span><span class="token function">e</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token string-property property">&quot;stroke&quot;</span><span class="token operator">:</span><span class="token string">&quot;Red&quot;</span><span class="token punctuation">,</span><span class="token string-property property">&quot;stroke-width&quot;</span><span class="token operator">:</span><span class="token number">6</span><span class="token punctuation">,</span><span class="token string-property property">&quot;arrow-end&quot;</span><span class="token operator">:</span><span class="token string">&quot;classic-wide-long&quot;</span><span class="token punctuation">}</span><span class="token punctuation">)</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>st=&gt;start: Need something to be translated!:&gt;https://www.localistars.com[blank]
e=&gt;end: Be happy!:&gt;https://youtu.be/e6Ede8hdU8c
cond=&gt;condition: Are you a client
or a translator?
subc=&gt;subroutine: Why should you choose a localistar?:&gt;https://www.localistars.com/for-clients.html
subt=&gt;subroutine: Why should you become a localistar?:&gt;https://www.localistars.com/for-translators.html
op=&gt;operation: Check out how it works!:&gt;https://www.localistars.com/how-it-works.html
io=&gt;inputoutput: Work together with your partner!:&gt;https://www.localistars.app/login

st-&gt;cond
cond(no@client)-&gt;subc-&gt;op-&gt;io-&gt;e
cond(yes@translator)-&gt;subt-&gt;op-&gt;io-&gt;e
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>st<span class="token operator">=&gt;</span>start<span class="token operator">:</span> Need something to be translated<span class="token operator">!</span><span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>localistars<span class="token punctuation">.</span>com<span class="token punctuation">[</span>blank<span class="token punctuation">]</span>
e<span class="token operator">=&gt;</span>end<span class="token operator">:</span> Be happy<span class="token operator">!</span><span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>youtu<span class="token punctuation">.</span>be<span class="token operator">/</span>e6Ede8hdU8c
cond<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> Are you a client
or a translator<span class="token operator">?</span>
subc<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> Why should you choose a localistar<span class="token operator">?</span><span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>localistars<span class="token punctuation">.</span>com<span class="token operator">/</span><span class="token keyword">for</span><span class="token operator">-</span>clients<span class="token punctuation">.</span>html
subt<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> Why should you become a localistar<span class="token operator">?</span><span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>localistars<span class="token punctuation">.</span>com<span class="token operator">/</span><span class="token keyword">for</span><span class="token operator">-</span>translators<span class="token punctuation">.</span>html
op<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> Check out how it works<span class="token operator">!</span><span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>localistars<span class="token punctuation">.</span>com<span class="token operator">/</span>how<span class="token operator">-</span>it<span class="token operator">-</span>works<span class="token punctuation">.</span>html
io<span class="token operator">=&gt;</span>inputoutput<span class="token operator">:</span> Work together <span class="token keyword">with</span> your partner<span class="token operator">!</span><span class="token operator">:</span><span class="token operator">&gt;</span>https<span class="token operator">:</span><span class="token operator">/</span><span class="token operator">/</span>www<span class="token punctuation">.</span>localistars<span class="token punctuation">.</span>app<span class="token operator">/</span>login

st<span class="token operator">-</span><span class="token operator">&gt;</span>cond
<span class="token function">cond</span><span class="token punctuation">(</span>no@client<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>subc<span class="token operator">-</span><span class="token operator">&gt;</span>op<span class="token operator">-</span><span class="token operator">&gt;</span>io<span class="token operator">-</span><span class="token operator">&gt;</span>e
<span class="token function">cond</span><span class="token punctuation">(</span>yes@translator<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>subt<span class="token operator">-</span><span class="token operator">&gt;</span>op<span class="token operator">-</span><span class="token operator">&gt;</span>io<span class="token operator">-</span><span class="token operator">&gt;</span>e
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="横向流程图" tabindex="-1"><a class="header-anchor" href="#横向流程图" aria-hidden="true">#</a> 横向流程图</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```mermaid
graph LR
A[方形] --&gt;B(圆角)
    B --&gt; C{条件a}
    C --&gt;|a=1| D[结果1]
    C --&gt;|a=2| E[结果2]
    F[横向流程图]
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-mermaid line-numbers-mode" data-ext="mermaid"><pre class="language-mermaid"><code><span class="token keyword">graph</span> LR
A<span class="token text string">[方形]</span> <span class="token arrow operator">--&gt;</span>B<span class="token text string">(圆角)</span>
    B <span class="token arrow operator">--&gt;</span> C<span class="token text string">{条件a}</span>
    C <span class="token arrow operator">--&gt;</span><span class="token label property">|a=1|</span> D<span class="token text string">[结果1]</span>
    C <span class="token arrow operator">--&gt;</span><span class="token label property">|a=2|</span> E<span class="token text string">[结果2]</span>
    F<span class="token text string">[横向流程图]</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="竖向流程图" tabindex="-1"><a class="header-anchor" href="#竖向流程图" aria-hidden="true">#</a> 竖向流程图</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```mermaid
graph TD
A[方形] --&gt; B(圆角)
    B --&gt; C{条件a}
    C --&gt; |a=1| D[结果1]
    C --&gt; |a=2| E[结果2]
    F[竖向流程图]
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-mermaid line-numbers-mode" data-ext="mermaid"><pre class="language-mermaid"><code><span class="token keyword">graph</span> TD
A<span class="token text string">[方形]</span> <span class="token arrow operator">--&gt;</span> B<span class="token text string">(圆角)</span>
    B <span class="token arrow operator">--&gt;</span> C<span class="token text string">{条件a}</span>
    C <span class="token arrow operator">--&gt;</span> <span class="token label property">|a=1|</span> D<span class="token text string">[结果1]</span>
    C <span class="token arrow operator">--&gt;</span> <span class="token label property">|a=2|</span> E<span class="token text string">[结果2]</span>
    F<span class="token text string">[竖向流程图]</span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="标准流程图" tabindex="-1"><a class="header-anchor" href="#标准流程图" aria-hidden="true">#</a> 标准流程图</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```flow
st=&gt;start: 开始框
op=&gt;operation: 处理框
cond=&gt;condition: 判断框(是或否?)
sub1=&gt;subroutine: 子流程
io=&gt;inputoutput: 输入输出框
e=&gt;end: 结束框
st-&gt;op-&gt;cond
cond(yes)-&gt;io-&gt;e
cond(no)-&gt;sub1(right)-&gt;op
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>st<span class="token operator">=&gt;</span>start<span class="token operator">:</span> 开始框
op<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> 处理框
cond<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> <span class="token function">判断框</span><span class="token punctuation">(</span>是或否<span class="token operator">?</span><span class="token punctuation">)</span>
sub1<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> 子流程
io<span class="token operator">=&gt;</span>inputoutput<span class="token operator">:</span> 输入输出框
e<span class="token operator">=&gt;</span>end<span class="token operator">:</span> 结束框
st<span class="token operator">-</span><span class="token operator">&gt;</span>op<span class="token operator">-</span><span class="token operator">&gt;</span>cond
<span class="token function">cond</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>io<span class="token operator">-</span><span class="token operator">&gt;</span>e
<span class="token function">cond</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">sub1</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="标准流程图-横向" tabindex="-1"><a class="header-anchor" href="#标准流程图-横向" aria-hidden="true">#</a> 标准流程图（横向）</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```flow
st=&gt;start: 开始框
op=&gt;operation: 处理框
cond=&gt;condition: 判断框(是或否?)
sub1=&gt;subroutine: 子流程
io=&gt;inputoutput: 输入输出框
e=&gt;end: 结束框
st(right)-&gt;op(right)-&gt;cond
cond(yes)-&gt;io(bottom)-&gt;e
cond(no)-&gt;sub1(right)-&gt;op
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>st<span class="token operator">=&gt;</span>start<span class="token operator">:</span> 开始框
op<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> 处理框
cond<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> <span class="token function">判断框</span><span class="token punctuation">(</span>是或否<span class="token operator">?</span><span class="token punctuation">)</span>
sub1<span class="token operator">=&gt;</span>subroutine<span class="token operator">:</span> 子流程
io<span class="token operator">=&gt;</span>inputoutput<span class="token operator">:</span> 输入输出框
e<span class="token operator">=&gt;</span>end<span class="token operator">:</span> 结束框
<span class="token function">st</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">op</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>cond
<span class="token function">cond</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">io</span><span class="token punctuation">(</span>bottom<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>e
<span class="token function">cond</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span><span class="token function">sub1</span><span class="token punctuation">(</span>right<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>op
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h3 id="流程图语法" tabindex="-1"><a class="header-anchor" href="#流程图语法" aria-hidden="true">#</a> 流程图语法</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>一般节点连接：
    节点-&gt;节点
条件判断节点连接：
    条件节点(yes)-&gt;正确应答节点
    条件节点(no)-&gt;错误应答节点
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>start-&gt;isLogin
isLogin(yes)-&gt;test
isLogin(no)-&gt;login-&gt;test
test-&gt;end
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>start=&gt;start: 开始
isLogin=&gt;condition: 是否已登录？
login=&gt;operation: 登陆
selectPic=&gt;operation: 选择一张图片
isPic=&gt;condition: 格式是否正确？
doIt=&gt;operation: 完成资料
isRight=&gt;condition: 资料是否符合要求？
end=&gt;end: 完成

start-&gt;isLogin
isLogin(yes)-&gt;selectPic
isLogin(no)-&gt;login-&gt;selectPic
selectPic-&gt;isPic
isPic(yes)-&gt;doIt-&gt;isRight
isPic(no)-&gt;selectPic
isRight(yes)-&gt;end
isRight(no)-&gt;doIt
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-flow line-numbers-mode" data-ext="flow"><pre class="language-flow"><code>start<span class="token operator">=&gt;</span>start<span class="token operator">:</span> 开始
isLogin<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> 是否已登录？
login<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> 登陆
selectPic<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> 选择一张图片
isPic<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> 格式是否正确？
doIt<span class="token operator">=&gt;</span>operation<span class="token operator">:</span> 完成资料
isRight<span class="token operator">=&gt;</span>condition<span class="token operator">:</span> 资料是否符合要求？
end<span class="token operator">=&gt;</span>end<span class="token operator">:</span> 完成

start<span class="token operator">-</span><span class="token operator">&gt;</span>isLogin
<span class="token function">isLogin</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>selectPic
<span class="token function">isLogin</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>login<span class="token operator">-</span><span class="token operator">&gt;</span>selectPic
selectPic<span class="token operator">-</span><span class="token operator">&gt;</span>isPic
<span class="token function">isPic</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>doIt<span class="token operator">-</span><span class="token operator">&gt;</span>isRight
<span class="token function">isPic</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>selectPic
<span class="token function">isRight</span><span class="token punctuation">(</span>yes<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>end
<span class="token function">isRight</span><span class="token punctuation">(</span>no<span class="token punctuation">)</span><span class="token operator">-</span><span class="token operator">&gt;</span>doIt
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>更多详细的高级用法：<a href="https://www.runoob.com/markdown/md-advance.html" target="_blank" rel="noopener noreferrer">菜鸟教程Markdown高级用法<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>、<a href="https://www.zybuluo.com/mdeditor?url=https://www.zybuluo.com/static/editor/md-help.markdown#cmd-markdown-%E9%AB%98%E9%98%B6%E8%AF%AD%E6%B3%95%E6%89%8B%E5%86%8C" target="_blank" rel="noopener noreferrer">Cmd Markdown 简明语法手册<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><h2 id="甘特图" tabindex="-1"><a class="header-anchor" href="#甘特图" aria-hidden="true">#</a> 甘特图</h2><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```mermaid
gantt
	title 项目开发流程
	section 项目确定
		需求分析:a1,2016-06-22,3d
		可行性报告:after a1,5d
		概念验证:5d
	section 项目实施
		概要设计:2016-07-05,5d
		详细设计:2016-07-08,10d
		编码:2016-07-15,10d
		测试:2016-07-22,5d
	section 发布验收
		发布:2d
		验收:3d
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-mermaid line-numbers-mode" data-ext="mermaid"><pre class="language-mermaid"><code><span class="token keyword">gantt</span>
	title 项目开发流程
	section 项目确定
		需求分析<span class="token operator">:</span>a1,2016-06-22,3d
		可行性报告<span class="token operator">:</span>after a1,5d
		概念验证<span class="token operator">:</span>5d
	section 项目实施
		概要设计<span class="token operator">:</span>2016-07-05,5d
		详细设计<span class="token operator">:</span>2016-07-08,10d
		编码<span class="token operator">:</span>2016-07-15,10d
		测试<span class="token operator">:</span>2016-07-22,5d
	section 发布验收
		发布<span class="token operator">:</span>2d
		验收<span class="token operator">:</span>3d
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>```mermaid
%% 语法示例
        gantt
        dateFormat  YYYY-MM-DD
        title 软件开发甘特图
        section 设计
        需求                      :done,    des1, 2014-01-06,2014-01-08
        原型                      :active,  des2, 2014-01-09, 3d
        UI设计                     :         des3, after des2, 5d
    未来任务                     :         des4, after des3, 5d
        section 开发
        学习准备理解需求                      :crit, done, 2014-01-06,24h
        设计框架                             :crit, done, after des2, 2d
        开发                                 :crit, active, 3d
        未来任务                              :crit, 5d
        耍                                   :2d
        section 测试
        功能测试                              :active, a1, after des3, 3d
        压力测试                               :after a1  , 20h
        测试报告                               : 48h
```
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-mermaid line-numbers-mode" data-ext="mermaid"><pre class="language-mermaid"><code><span class="token comment">%% 语法示例</span>
        <span class="token keyword">gantt</span>
        dateFormat  YYYY-MM-DD
        title 软件开发甘特图
        section 设计
        需求                      <span class="token operator">:</span>done,    des1, 2014-01-06,2014-01-08
        原型                      <span class="token operator">:</span>active,  des2, 2014-01-09, 3d
        UI设计                     <span class="token operator">:</span>         des3, after des2, 5d
    未来任务                     <span class="token operator">:</span>         des4, after des3, 5d
        section 开发
        学习准备理解需求                      <span class="token operator">:</span>crit, done, 2014-01-06,24h
        设计框架                             <span class="token operator">:</span>crit, done, after des2, 2d
        开发                                 <span class="token operator">:</span>crit, active, 3d
        未来任务                              <span class="token operator">:</span>crit, 5d
        耍                                   <span class="token operator">:</span>2d
        section 测试
        功能测试                              <span class="token operator">:</span>active, a1, after des3, 3d
        压力测试                               <span class="token operator">:</span>after a1  , 20h
        测试报告                               <span class="token operator">:</span> 48h
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p>如果感兴趣可以去<a href="https://www.zybuluo.com/mdeditor?url=https://www.zybuluo.com/static/editor/md-help.markdown#cmd-markdown-%E9%AB%98%E9%98%B6%E8%AF%AD%E6%B3%95%E6%89%8B%E5%86%8C" target="_blank" rel="noopener noreferrer">Cmd Markdown 简明语法手册<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a>这里学习更多。</p><p><a href="https://blog.csdn.net/qq_32708605/article/details/123801702" target="_blank" rel="noopener noreferrer">Markdown画图<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><h2 id="在vuepress中使用mermaid" tabindex="-1"><a class="header-anchor" href="#在vuepress中使用mermaid" aria-hidden="true">#</a> 在vuepress中使用mermaid</h2><p><a href="https://www.techgrow.cn/posts/bc19d204.html" target="_blank" rel="noopener noreferrer">VuePress 渲染 Mermaid 绘图<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span></a></p><div class="language-text line-numbers-mode" data-ext="text"><pre class="language-text"><code>npm install mermaid
npm i -D @vuepress/plugin-register-components@next
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div></div></div><p>在components文件下创建mermaid.vue</p><div class="language-vue line-numbers-mode" data-ext="vue"><pre class="language-vue"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>mermaid<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>slot</span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>slot</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>

<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
  <span class="token function">mounted</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">import</span><span class="token punctuation">(</span><span class="token string">&quot;mermaid/dist/mermaid&quot;</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">m</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
      m<span class="token punctuation">.</span><span class="token function">initialize</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
        <span class="token literal-property property">startOnLoad</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
      <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
      m<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span><span class="token punctuation">,</span>
  <span class="token function">updated</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword">import</span><span class="token punctuation">(</span><span class="token string">&quot;mermaid/dist/mermaid&quot;</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">m</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
      m<span class="token punctuation">.</span><span class="token function">initialize</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
        <span class="token literal-property property">startOnLoad</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
      <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
      m<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">;</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><div class="language-html line-numbers-mode" data-ext="html"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>mermaid</span><span class="token punctuation">&gt;</span></span>
{{`
  ......（Mermaid 的内容）
`}}
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>mermaid</span><span class="token punctuation">&gt;</span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="数学公式" tabindex="-1"><a class="header-anchor" href="#数学公式" aria-hidden="true">#</a> 数学公式</h2><p>使用 <code>$</code> 表示，其中一个 $ 表示在行内，两个 $ 表示独占一行。</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>$\sum_{i=1}^n a_i=0$
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><p><!----></p><p>推荐一个常用的数学公式在线编译网站：https://private.codecogs.com/latex/eqneditor.php</p><h2 id="待办事项" tabindex="-1"><a class="header-anchor" href="#待办事项" aria-hidden="true">#</a> 待办事项</h2><p><code>-[]</code> 表示未完成；<code>-[x]</code>表示已完成</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>- [ ] 支持以 PDF 格式导出文稿
- [ ] 改进 Cmd 渲染算法，使用局部渲染技术提高渲染效率
- [x] 新增 Todo 列表功能
- [x] 修复 LaTex 公式渲染问题
- [x] 新增 LaTex 公式编号功能
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><ul><li>[ ] 支持以 PDF 格式导出文稿</li><li>[ ] 改进 Cmd 渲染算法，使用局部渲染技术提高渲染效率</li><li>[x] 新增 Todo 列表功能</li><li>[x] 修复 LaTex 公式渲染问题</li><li>[x] 新增 LaTex 公式编号功能</li></ul><h2 id="html" tabindex="-1"><a class="header-anchor" href="#html" aria-hidden="true">#</a> HTML</h2><div class="language-html line-numbers-mode" data-ext="html"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>table</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span> <span class="token attr-name">rowspan</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>2<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>值班人员<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span><span class="token punctuation">&gt;</span></span>星期一<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span><span class="token punctuation">&gt;</span></span>星期二<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>th</span><span class="token punctuation">&gt;</span></span>星期三<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>th</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>tr</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">&gt;</span></span>李强<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">&gt;</span></span>张明<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">&gt;</span></span>
        <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>td</span><span class="token punctuation">&gt;</span></span>王平<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>td</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>tr</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>table</span><span class="token punctuation">&gt;</span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><table><tr><th rowspan="2">值班人员</th><th>星期一</th><th>星期二</th><th>星期三</th></tr><tr><td>李强</td><td>张明</td><td>王平</td></tr></table><div class="language-html line-numbers-mode" data-ext="html"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>font</span> <span class="token attr-name">face</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>楷体<span class="token punctuation">&quot;</span></span> <span class="token attr-name">color</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span>#00ffff</span> <span class="token attr-name">size</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span>5</span><span class="token punctuation">&gt;</span></span>改变文字格式<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>font</span><span class="token punctuation">&gt;</span></span>
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><!----><h1 id="typora" tabindex="-1"><a class="header-anchor" href="#typora" aria-hidden="true">#</a> Typora</h1><h3 id="任务列表" tabindex="-1"><a class="header-anchor" href="#任务列表" aria-hidden="true">#</a> 任务列表</h3><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>- [ ] 不勾选
- [x] 勾选
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div><div class="line-number"></div></div></div><ul><li><p>[ ] 不勾选</p></li><li><p>[x] 勾选</p></li></ul><h2 id="跨度元素-html" tabindex="-1"><a class="header-anchor" href="#跨度元素-html" aria-hidden="true">#</a> 跨度元素-HTML</h2><p>使用 <code>&lt;center&gt;这是要居中的内容&lt;/center&gt;</code>可以使文本居中</p><h2 id="跨度元素-嵌入内容" tabindex="-1"><a class="header-anchor" href="#跨度元素-嵌入内容" aria-hidden="true">#</a> 跨度元素-嵌入内容</h2><p>支持iframe-based嵌入代码，</p><div class="language-txt line-numbers-mode" data-ext="txt"><pre class="language-txt"><code>&lt;iframe height=&#39;265&#39; scrolling=&#39;no&#39; title=&#39;Fancy Animated SVG Menu&#39; src=&#39;http://codepen.io/jeangontijo/embed/OxVywj/?height=265&amp;theme-id=0&amp;default-tab=css,result&amp;embed-version=2&#39; frameborder=&#39;no&#39; allowtransparency=&#39;true&#39; allowfullscreen=&#39;true&#39; style=&#39;width: 100%;&#39;&gt;&lt;/iframe&gt;
</code></pre><div class="line-numbers" aria-hidden="true"><div class="line-number"></div></div></div><h2 id="跨度元素-换行符" tabindex="-1"><a class="header-anchor" href="#跨度元素-换行符" aria-hidden="true">#</a> 跨度元素-换行符</h2><p>使用 <code>空格 + 空格 + Enter</code>可以实现换行，例如：</p><p>或者可以使用<code>&lt;br/&gt;</code>实现换行。</p></div><!--[--><!--]--></div><footer class="page-meta"><div class="meta-item edit-link"><a class="external-link meta-item-label" href="https://gitee.com/Francis-xsc/francis-xsc/edit/main/program/Markdown.md" rel="noopener noreferrer" target="_blank" aria-label="Edit this page"><!--[--><!--]--> Edit this page <span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><span class="external-link-icon-sr-only">open in new window</span></span><!--[--><!--]--></a></div><div class="meta-item last-updated"><span class="meta-item-label">最后更新时间: </span><!----></div><div class="meta-item contributors"><span class="meta-item-label">Contributors: </span><span class="meta-item-info"><!--[--><!--[--><span class="contributor" title="email: 920364365@qq.com">Francis-xsc</span><!----><!--]--><!--]--></span></div></footer><!----><!--[--><!--]--></main><!--]--></div><!----><!--]--></div>
    <script type="module" src="/assets/app-6c74e544.js" defer></script>
  </body>
</html>
